<template>
  <view>
    <view class="margin padding xm-title">
      <view class="xm-title-p1">PJ2023100603</view>
      <view class="xm-title-p2"
        >中国水利水电第五工程局有限公司轨道交通4号线西延伸段盘桂路站给水管道迁改工程</view
      >
      <image :src="src" class="xm-title-img"></image>
    </view>
    <view> </view>
    <view class="flex margin flex-wrap justify-between">
      <view
        class="flex bg-white padding radius margin-bottom"
        v-for="(item, index) in cuIconList"
        :key="index"
        @click="goRoute(item.url)"
      >
        <view class="xm-item">
          <view class="xm-item-1">{{ item.name }}</view>
          <view class="xm-item-2">{{ item.num1 + "/" + item.num2 }} </view>
        </view>
        <!-- <u-icon :name="nameIcon"></u-icon> -->
        <u-image width="72rpx" height="72rpx" :src="item.icon"></u-image>
      </view>
    </view>
    <!-- <view class="cu-list grid col-2 no-border">
			<view class="cu-item light bg-grey margin radius shadow" v-for="(item,index) in cuIconList" :key="index"
				@click="goRoute(item.url)">
				<view class="cuIcon-cardboardfill text-grey">
					<view class="cu-tag badge" v-if="item.badge!=0">
						{{item.badge}}
					</view>
				</view>
				<text class="text-xxl">{{item.name}}</text>
			</view>
		</view> -->
  </view>
</template>
<script>
export default {
  data() {
    return {
      nameIcon: "/static/image/zfgs/index/icon@2x.png",
      src: "/static/image/zfgs/index/icon@2x.png",
      cuIconList: [
        {
          name: "项目详情",
          icon: "/static/image/zfgs/index/icon@2x(1).png",
          num1: 0,
          num2: 10,
          url: " ",
        },
        {
          name: "进/撤场",
          icon: "/static/image/zfgs/index/icon@2x(2).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/proj/weekly/pmWeekly/list",
        },
        {
          name: "巡检",
          icon: "/static/image/zfgs/index/icon@2x(3).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/proj/enex/pmApproach/list",
        },
        {
          name: "整改",
          icon: "/static/image/zfgs/index/icon@2x(4).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/material/check/pmMaterialcheck/list",
        },
        {
          name: "材料抽检",
          icon: "/static/image/zfgs/index/icon@2x(5).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/proj/zg/pmRectification/form",
        },
        {
          name: "设计变更",
          icon: "/static/image/zfgs/index/icon@2x(6).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/proj/enex/pmApproach/list",
        },
        {
          name: "试压",
          icon: "/static/image/zfgs/index/icon@2x(7).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/design/visa/pmVisa/list",
        },
        {
          name: "接水",
          icon: "/static/image/zfgs/index/icon@2x(9).png",
          num1: 0,
          num2: 10,
          url: " ",
        },
        {
          name: "签证",
          icon: "/static/image/zfgs/index/icon@2x(10).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/process/pressure/pmPressuretest/list",
        },
        {
          name: "中间验收",
          icon: "/static/image/zfgs/index/icon@2x(11).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/szjc/list",
        },
        {
          name: "预验收",
          icon: "/static/image/zfgs/index/icon@2x(12).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
        {
          name: "废管",
          icon: "/static/image/zfgs/index/icon@2x(13).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
        {
          name: "竣工验收",
          icon: "/static/image/zfgs/index/icon@2x(14).png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
        {
          name: "项目文件",
          icon: "/static/image/zfgs/index/xmfj.png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
        {
          name: "报装附件",
          icon: "/static/image/zfgs/index/xmfj.png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
        {
          name: "报装日志",
          icon: "/static/image/zfgs/index/bzrz.png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
        {
          name: "延期豁免",
          icon: "/static/image/zfgs/index/yqhm.png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
        {
          name: "挂表",
          icon: "/static/image/zfgs/index/gb.png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
        {
          name: "通水推报装",
          icon: "/static/image/zfgs/index/tstbz.png",
          num1: 0,
          num2: 10,
          url: "/pages/zfgs/index/xmfj/list",
        },
      ],
    };
  },
  onShow() {
    uni.showTabBar();
  },
  onLoad(e) {
    console.log(e);
  },
  methods: {
    goRoute(url) {
      uni.navigateTo({
        url: url,
      });
    },
  },
};
</script>
<style scoped lang="scss">
.cu-item {
  width: 41% !important;
  height: 90px;
}

.cuIcon-cardboardfill {
  margin-top: 20px !important;
}
.xm-title {
  border-radius: 20rpx;
  font-size: 30rpx;
  background-color: #fff;
  // background-image: url("/static/image/zfgs/index/icon@2x.png");
  // background-repeat: no-repeat;
  // background-size: 38rpx 42rpx;
  // background-position: 10rpx 10rpx;
  position: relative;
  .xm-title-p1 {
    color: #999999;
    font-size: 30rpx;
    line-height: 40rpx;
    margin-bottom: 8rpx;
  }
  .xm-title-p2 {
    color: #3d3d3d;
    line-height: 48rpx;
  }
  .xm-title-img {
    width: 38rpx;
    height: 42rpx;
    position: absolute;
    top: 0;
    right: 32rpx;
  }
}

.xm-item-1 {
  font-size: 34rpx;
  color: #3d3d3d;
  line-height: 40rpx;
  position: relative;
  margin-bottom: 26rpx;
}
.xm-item-1::after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 26rpx;
  height: 4rpx;
  background-color: #bbbbbb;
  bottom: -16rpx;
  left: 0;
}
.xm-item {
  width: 200rpx;
}
.radius {
  border-radius: 20rpx;
}
.xm-item-2 {
  font-size: 28rpx;
  color: #999999;
}
</style>